<template>
	<view class="index-view">
		<view class="top-bar"><uni-navbar :fixed="true" :back="false" color="#fff" :title="title"></uni-navbar></view>

		<view class="banner"><u-swiper :list="swiperList" :effect3d="true" :title="true" mode="none" height="280" @click="swiperClick"></u-swiper></view>

		<view class="index-card">
			<u-scroll-list class="card-link" :barWidth="barWidth" :colList="11" :column="4" @scrollItemEmitsClick="scrollItemEmitsClick">
				<view span="3" v-if="$sysMenus('tabl')">
					<navigator hover-class="none" class="link-item" url="/pagesB/proposal/index">
						<image class="image" src="/static/img/index_icon_01.png" mode="aspectFill"></image>
						提案办理
					</navigator>
				</view>
				<view span="3" v-if="$sysMenus('sqmy')">
					<navigator hover-class="none" class="link-item" url="/pagesB/will/index">
						<image class="image" src="/static/img/index_icon_02.png" mode="aspectFill"></image>
						社情民意
					</navigator>
				</view>
				<view span="3" v-if="$sysMenus('perform')" @click="perform()">
					<view hover-class="none" class="link-item">
						<image class="image" src="/static/img/index_icon_03.png" mode="aspectFill"></image>
						履职管理
					</view>
				</view>
				<view span="3" v-if="$sysMenus('hyhd')">
					<navigator hover-class="none" class="link-item" url="/pagesB/meeting/index">
						<image class="image" src="/static/img/index_icon_04.png" mode="aspectFill"></image>
						会议活动
					</navigator>
				</view>
				<view span="3" v-if="$sysMenus('dhhy')">
					<navigator hover-class="none" class="link-item" url="/pagesB/perform/index">
						<image class="image" src="/static/img/index_icon_05.png" mode="aspectFill"></image>
						大会履职
					</navigator>
				</view>
				<view span="3" v-if="$sysMenus('wyfc')">
					<navigator hover-class="none" class="link-item" url="/pagesA/avenger/list">
						<image class="image" src="/static/img/index_icon_06.png" mode="aspectFill"></image>
						代表风采
					</navigator>
				</view>
				<view span="3" v-if="$sysMenus('wlyz')">
					<navigator hover-class="none" class="link-item" url="/pagesA/discussion/index">
						<image class="image" src="/static/img/index_icon_07.png" mode="aspectFill"></image>
						网络议政
					</navigator>
				</view>
				<view span="3" v-if="$sysMenus('sxzx_app')">
					<navigator hover-class="none" class="link-item" url="/pagesA/bbq/index">
						<image class="image" src="/static/img/index_icon_08.png" mode="aspectFill"></image>
						书香人大
					</navigator>
				</view>
				<!-- <view span="3" v-if="$sysMenus('ycxs')">
						<navigator hover-class="none" class="link-item" url="/pagesB/negotiate/index">
							<image class="image" src="/static/img/index_icon_09.png" mode="aspectFill"></image>
							远程协商
						</navigator>
					</view> -->
				<view span="3" @click="scan()">
					<view hover-class="none" class="link-item">
						<image class="image" src="/static/img/index_icon_13.png" mode="aspectFill"></image>
						扫码签到
					</view>
				</view>
				<view span="3" v-if="$sysMenus('hyfy')">
					<navigator hover-class="none" class="link-item" url="/pagesB/speech/index">
						<image class="image" src="/static/img/index_icon_10.png" mode="aspectFill"></image>
						会议发言
					</navigator>
				</view>
				<view span="3" v-if="$sysMenus('djhd')">
					<navigator hover-class="none" class="link-item" url="/pagesB/work/list">
						<image class="image" src="/static/img/index_icon_11.png" mode="aspectFill"></image>
						党建工作
					</navigator>
				</view>
				<view span="3" v-if="$sysMenus('oa')">
					<navigator hover-class="none" class="link-item" url="/pagesB/oa/index">
						<image class="image" src="/static/img/index_icon_12.png" mode="aspectFill"></image>
						机关办公
					</navigator>
				</view>
				<view span="3" v-if="$sysMenus('dagl')">
					<navigator hover-class="none" class="link-item" url="/pagesB/united/index">
						<image class="image" src="/static/img/index_icon_14.png" mode="aspectFill"></image>
						档案管理
					</navigator>
				</view>
			</u-scroll-list>
		</view>

		<view class="container" style="background-color: #fff" v-if="$sysMenus('tzgg_top')">
			<view class="h2-row">
				<view class="h2-title">通知公告</view>
				<navigator hover-class="none" class="h2-col" url="/pagesB/notice/list">查看更多</navigator>
			</view>

			<view class="list-box" :class="Notice.loading == 'nodata' ? 'nodata' : ''">
				<view class="list-info_05" v-for="(item, index) of Notice.list" :key="index" @click="navTo(item)">
					<view class="right-type" v-if="item.curUserReadStatus != '已读'"></view>
					<view class="info-title clamp">{{ item.title }}</view>
					<view class="info-btm">
						{{ item.userName }}
						<text class="line"></text>
						{{ item.createTime | parseTime('{y}-{m}-{d}') }}
					</view>
				</view>

				<view v-if="Notice.loading == 'nodata'"><image class="image" src="/static/result-img/no-record.png" mode="widthFix"></image></view>
			</view>
		</view>

		<view class="p-popup" v-if="show" @click="show = false">
			<view class="image-box">
				<image class="image" src="/static/img/bg_01.png" mode="widthFix"></image>
				<view class="info">
					<view class="title clamp2">{{ meetingInfo.title }}</view>
					<view class="name clamp">姓名：{{ meetingInfo.userName }}</view>
					<view class="text clamp">座位信息：{{ $htmlRegx(meetingInfo.seatNo) }}</view>
					<view class="text clamp">车辆信息：{{ $htmlRegx(meetingInfo.carNo) }}</view>
					<view class="text clamp">房间信息：{{ $htmlRegx(meetingInfo.hotelNo) }}</view>
					<view class="text clamp">就餐信息：{{ $htmlRegx(meetingInfo.dinnerInfo) }}</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
import { mapState } from 'vuex';
export default {
	data() {
		return {
			title: '寿光数字人大平台',
			text: '',
			list: [['', '']],
			swiperList: [],
			show: false,
			current: 0,
			tabList: [
				{
					name: '我的消息',
					count: '0'
				},
				{
					name: '通知公告',
					count: '0'
				}
			],
			meetingInfo: {},
			proposalList: [],
			willList: [],
			meetingList: [],
			activeList: [],
			assemblyList: [],
			menus: [],
			numAll: [
				{
					keyName: '提案',
					count: 0
				}
			],

			colList: 6,
			column: 3,
			barWidth: 80,
			barShow: true,
			dataSource: [],

			sqmyNum: 0,
			motionNum: 0,
			Notice: {
				tabsList: [
					{
						name: '未读',
						value: 0
					},
					{
						name: '已读',
						value: 1
					}
				],
				colorMap: {
					0: '#0099ff',
					1: '#ff9900',
					2: '#19be6b'
				},
				list: [],
				pageNum: 1,
				pageSize: 10,
				readType: '',
				announcements: {
					dataType: '1',
					title: ''
				},
				loaded: false,
				loading: 'loadmore'
			}
		};
	},
	onLoad() {
		this.loadLogin();
		this.loadData();
		this.getBanner();
		this.getBaiduToken();
	},
	onShow() {
		this.loadLogin();
		this.loadNotice('refresh');
		this.loadDict('tip', 'tip');
	},
	onShareAppMessage(res) {
		return {
			title: this.title,
			path: '/pages/load/index'
		};
	},
	onShareTimeline(res) {
		return {};
	},
	onPullDownRefresh() {
		this.loadData();
		this.loadNotice('refresh');
	},
	computed: {
		...mapState(['userInfo', 'sysUser'])
	},
	methods: {
		loadLogin() {
			if (this.userInfo.Authorization) {
				this.clientCode = this.userInfo.sysUser.clientCode;
				this.roleCodes = this.userInfo.roleCodes.join(',');
				this.userId = this.userInfo.sysUser.id;
				this.userName = this.userInfo.sysUser.userName;
				this.region = this.userInfo.sysUser.remark2;
				this.title = `${this.userInfo.sysUser.clientName}数字人大平台`;
				this.jieci = this.userInfo.jieCi.pName + this.userInfo.jieCi.name;

				uni.setNavigationBarTitle({
					title: this.title
				});
			} else {
				this.$logout();
			}
		},
		loadData() {
			let data = {
				pageNum: 1,
				pageSize: 10,
				currentUserId: this.userId,
				clientCode: this.clientCode,
				roleCodes: this.roleCodes,
				readType: '',
				announcements: {
					dataType: '1'
				}
			};
			this.$request('/announcements/myList', data).then((res) => {
				if (res.data.records.length > 1) {
					this.list = [];
					let arr = [];
					res.data.records.forEach((item) => {
						if (arr.length > 0) {
							arr.push(item.title);
							this.list.push(arr);
							arr = [];
						} else {
							arr.push(item.title);
						}
					});
				} else if (res.data.records.length == 1) {
					this.list = [[res.data.records[0].title]];
				}
			});
		},
		loadNotice(type = 'add') {
			if (type == 'add') {
				if (this.Notice.loading == 'nomore') {
					return false;
				}
				this.Notice.loading = 'loading';
			} else {
				this.Notice.loading = 'loading';
			}
			if (type != 'add') {
				this.Notice.pageNum = 1;
			}
			let data = {
				pageNum: this.Notice.pageNum,
				pageSize: this.Notice.pageSize,
				currentUserId: this.userId,
				roleCodes: this.roleCodes,
				clientCode: this.clientCode,
				readType: this.Notice.readType,
				announcements: this.Notice.announcements
			};
			this.$request('/announcements/myList', data).then((res) => {
				let count = 0;
				if (type != 'add') {
					uni.stopPullDownRefresh();
					this.Notice.list = [];
				}

				this.Notice.loading = this.Notice.pageNum < Math.ceil(res.data.total / this.Notice.pageSize) ? 'loadmore' : 'nomore';
				this.Notice.pageNum = this.Notice.pageNum + 1;
				this.Notice.list = this.Notice.list.concat(res.data.records);
				this.Notice.loaded = true;
				if (this.Notice.list.length <= 0) {
					this.Notice.loading = 'nodata';
				}
			});
		},
		getBaiduToken() {
			this.$request('/baidu/ttsToken', {
				clientCode: this.clientCode,
				userId: this.userId
			}).then((res) => {
				uni.setStorageSync('baiduToken', res.data);
			});
		},
		getBanner() {
			this.$request('/banner/list', {
				clientCode: this.clientCode,
				userId: this.userId,
				banner: {
					enable: '1'
				}
			}).then((res) => {
				if (!res.data) {
					return false;
				}
				this.swiperList = [];
				res.data.records.forEach((item) => {
					if (item.fileList && item.fileList.length > 0) {
						this.swiperList.push({
							id: item.id,
							title: item.title,
							url: item.externalLink,
							image: this.$imagePreview(item.fileList[0].path)
						});
					}
				});
				uni.setStorageSync('swiperList', this.swiperList);
			});
		},
		scrollItemEmitsClick(item, index, arr) {
			console.log(item, index, arr, 1);
		},
		swiperClick(index) {
			// this.current = index;
			if (this.swiperList[index].id) {
				uni.navigateTo({
					url: '/pagesA/banner/detail?id=' + this.swiperList[index].id
				});
			}
		},
		tabsChange(index) {
			this.current = index;
		},
		typeNotice(e) {
			this.Notice.readType = e.toString();
			this.loadNotice('refresh');
		},
		loadDict(type, key) {
			uni.setStorageSync('tip', '');
			this.$request('/system/sys-dict/dictList', {
				clientCode: this.clientCode,
				sysDict: {
					dictType: type
				}
			}).then((res) => {
				if (!res.data) {
					return false;
				}
				let tip = res.data[0].dictValue;
				uni.setStorageSync('tip', tip);
			});
		},
		ycxs() {},
		perform() {
			if (this.$sysMenus('perform_eval_group')) {
				uni.navigateTo({
					url: '/pagesA/duties/index'
				});
			} else {
				//判断是否活动组
				if (this.$roleCodes('xiaozuguanliyuan')) {
					let wyhdz = this.userInfo.userInfo.wyhdz;
					if (wyhdz == null || wyhdz == '') {
						wyhdz = this.userInfo.userInfo.remark4;
					}
					uni.navigateTo({
						url: '/pagesA/duties/group?wyhdz=' + wyhdz
					});
				} else {
					uni.navigateTo({
						url: '/pagesA/duties/self'
					});
				}
			}
		},
		news() {
			uni.navigateTo({
				url: '/pages/news/list'
			});
		},
		system() {
			uni.navigateTo({
				url: '/pagesB/speech/list'
			});
		},
		scan() {
			uni.scanCode({
				onlyFromCamera: true,
				success: (res) => {
					this.qrcodeResult(res);
				}
			});
			// this.show = true;
		},
		qrcodeResult(res) {
			try {
				let resulet = JSON.parse(res.result);
				if (resulet.type == 'huiyi') {
					let typeMap = {
						1: '扫码签到',
						2: '刷脸签到',
						3: '手动签到',
						4: '代为签到'
					};
					let data = {
						signType: '1',
						meetingId: resulet.data.id,
						userId: this.userId
					};
					this.$request('/huiyihuodong/hyhd-meeting-user/signTime', data, {
						load: true
					}).then((res) => {
						this.meetingInfo = res.data;
						this.show = true;
						return false;
						if (!res.data.firstSign) {
							uni.showModal({
								title: '已通过' + typeMap[res.data.signType],
								content: '签到时间：' + res.data.signTime,
								complete: () => {}
							});
						}
					});
				} else if (resulet.type == 'xsys') {
					let data = {
						consultSign: {
							infoid: resulet.data.id,
							userId: this.userId,
							userName: this.userName
						}
					};
					this.$request('/xieshangyishi/consultSign/sign/add', data, {
						load: true
					}).then((res) => {
						this.$msg('签到成功！');
					});
				} else if (resulet.type == 'loginQr') {
					let data = {
						step: '3',
						qrId: resulet.data.id,
						userId: this.userId
					};
					this.$request('/loginQr', data, {
						load: true
					}).then((res) => {
						uni.navigateTo({
							url: '/pages/login/qrcode?qrId=' + resulet.data.id
						});
					});
				} else {
					this.$msg(resulet);
				}
			} catch (e) {
				this.$msg('扫码失败！');
			}
		},
		notice() {
			uni.navigateTo({
				url: '/pagesB/notice/list'
			});
		},
		navTo(item) {
			uni.navigateTo({
				url: '/pagesB/notice/detail?id=' + item.id
			});
		}
	}
};
</script>

<style lang="scss">
.banner {
	// height: 465rpx;
	min-height: 280rpx;
}

.uTabs {
	padding-top: 25rpx;
}

.notice-bar {
	margin: -56rpx 0 30rpx;
	padding: 0 6rpx;
	position: relative;
	z-index: 100;
	display: flex;
	flex-wrap: wrap;
	overflow: hidden;
	border-radius: 16rpx;
	background-color: #fff;

	.bar-ttl {
		align-self: center;
		width: 112rpx;
		padding: 0 24rpx;
		border-right: 1rpx solid #ebebeb;
	}

	.bar-list {
		width: calc(100% - 112rpx);
		min-height: 112rpx;
	}

	.notice {
		border-left: 1rpx solid #ebebeb;
		padding: 0 24rpx;
		align-self: center;
		position: relative;

		text {
			position: absolute;
			left: 36rpx;
			top: -16rpx;
			padding: 0 12rpx;
			font-size: 24rpx;
			color: #fff;
			border-radius: 24rpx;
			z-index: 10;
			background-color: #f6703b;
		}

		image {
			width: 18px;
		}
	}
}

.new-box {
	padding: 10rpx 0 30rpx;
	width: 100%;
}

.search-filter {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.filter-btn {
	margin: 30rpx auto 0;
	width: 160rpx;

	&.u-size-default {
		font-size: 14px;
		height: 55rpx;
		line-height: 55rpx;
	}

	&.u-btn--default {
		color: #666;
		border-color: #f9f8f6;
		background-color: #f9f8f6;

		&::after {
			border-color: #f9f8f6;
		}
	}
}

.index-card {
	padding: 20rpx 0;
	background-color: #fff;

	.card-ttl {
		margin-bottom: 16rpx;
		padding-left: 20rpx;
		font-size: 16px;
		font-weight: bold;
		color: #444;
		border-left: 10rpx solid #f00;
	}

	.card-box {
		display: flex;
		justify-content: space-between;
		padding: 40rpx 0 10rpx;
		border-top: 1rpx solid #ebebeb;

		.card-item {
			width: 190rpx;
		}
	}

	.card-link {
		.image {
			margin: 0 auto 22rpx;
			width: 88rpx;
			height: 88rpx;
		}

		.link-item {
			margin: 20rpx 0;
			font-size: 14px;
			line-height: 1;
			text-align: center;
		}
	}
}

.pro-row {
	.pro-title {
		margin-bottom: 20rpx;
		font-size: 15px;
		color: #e5231a;
	}
}

.todo-title {
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 20rpx;
	padding: 10rpx 0;
	font-size: 16px;
	font-weight: bold;
	color: #666;

	text {
		margin: 0 20rpx;
		width: 50rpx;
		height: 4rpx;
		background-color: #666;
	}
}

.todo-box {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;

	.todo-row {
		margin-bottom: 30rpx;
		padding: 30rpx;
		width: 48%;
		font-size: 16px;
		color: #444;
		border-radius: 30rpx;
		text-align: center;
		background-color: #fff;

		text {
			margin: 0 10rpx;
			font-weight: bold;
		}
	}

	.todo-ttl {
		margin-bottom: 20rpx;
		font-size: 16px;
		font-weight: bold;
		line-height: 48rpx;
		text-align: center;

		image {
			display: block;
			margin: 0 auto -48rpx;
			width: 280rpx;
		}
	}
}

.list-info_01 {
	margin: 0 30rpx;
}

.link-more {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 20rpx 30rpx;
	color: #666;
	text-align: center;

	.icon {
		margin-right: 10rpx;
	}
}

.p-popup {
	position: fixed;
	left: 0;
	top: 0;
	right: 0;
	bottom: 0;
	z-index: 100;
	background: rgba(0, 0, 0, 0.59);

	.image-box {
		position: relative;
		margin: 0 auto;
		padding-top: 252rpx;
		width: 588rpx;

		.image {
			position: absolute;
			left: 0;
			top: 0;
			right: 0;
			width: 588rpx;
		}

		.info {
			position: relative;
			z-index: 11;
		}

		.title {
			margin: 0 50rpx 84rpx;
			min-height: 100rpx;
			font-size: 18px;
			color: #e5231a;
			line-height: 50rpx;
			text-align: center;
		}

		.name {
			margin-bottom: 30rpx;
			font-size: 15px;
			color: #792d28;
			line-height: 42rpx;
			text-align: center;
		}

		.text {
			margin: 0 50rpx 10rpx;
			font-size: 13px;
			color: #666;
			line-height: 36rpx;
			text-align: center;
		}
	}
}

.nodata {
	width: 100%;
	padding-top: 60rpx;
	padding-bottom: 60rpx;

	.image {
		width: 100%;
		display: block;
	}
}
</style>
